home *** CD-ROM | disk | FTP | other *** search
/ Dynamic HTML Construction Kit / Dynamic HTML Construction Kit.iso / source_code / dhtmlunl / dhtml.exe / CD Content / Chap18 / dun18_5.txt < prev    next >
Encoding:
Text File  |  1997-12-18  |  10.6 KB  |  288 lines
  1. <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
  2.  
  3. <html><head>
  4.  
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  6.  
  7. <title>Baseball Cards</title></head>
  8.  
  9. <body bgcolor="#FFFFFF">
  10.  
  11. <p>
  12.  
  13. <object id="cards" ondatasetcomplete="dataloaded()"
  14.  
  15. classid="CLSID:333C7BC4-460F-11D0-BC04-0080C7055A83" width="192" height="192">
  16.  
  17.   <param name="DataURL" value="cards.txt">
  18.  
  19.   <param name="UseHeader" value="1">
  20.  
  21.   <param name="Sort" value="year; cardnumber">
  22.  
  23. </object>
  24.  
  25. </p>
  26.  
  27.  
  28.  
  29. <h3 align="center">
  30.  
  31. To filter the data for a specific year, enter the year here and click the
  32.  
  33. Filter button:</h3>
  34.  
  35. <form id="filterform">
  36.  
  37.   <div align="center"><center><h3>Year:
  38.  
  39.      <input type="text" name="FilterYear" size="20"></h3>
  40.  
  41.   </center></div>
  42.  
  43.   <div align="center"><center><h3>
  44.  
  45.   <input type="submit" value="Filter" name="B1" onclick="filteryear(0)">
  46.  
  47.   <input type="reset" value="Reset" name="B2" onclick="filteryear(1)">
  48.  
  49.   </h3></center></div>
  50.  
  51. </form>
  52.  
  53. <hr>
  54.  
  55. <h3 align="center">Use any of these buttons to sort the data:</h3>
  56.  
  57. <p align="center"><input type="button" value="Year/Card Number" name="B1"
  58.  
  59. onclick="buttonclick(1)"><input type="button" value="Description" name="B2"
  60.  
  61. onclick="buttonclick(2)"><input type="button" value="Year/Grade" name="B3"
  62.  
  63. onclick="buttonclick(3)"><input type="button" value="Value" name="B4"
  64.  
  65. onclick="buttonclick(4)"></p>
  66.  
  67. <h3 align="center">Or, to sort by any column, click the column's header.</h3>
  68.  
  69. <hr>
  70.  
  71.  
  72.  
  73. <!-- START modified from Listing 18.4 -->
  74.  
  75. <table border="1" datasrc="#cards" datapagesize=5
  76.  
  77.  align="center" cellpadding="2">
  78.  
  79. <!-- END modified from Listing 18.4 -->
  80.  
  81. <THEAD>
  82.  
  83.   <tr>
  84.  
  85.     <td align="left" id="year" onclick="tableclick('year')"
  86.  
  87.         bgcolor="#00FFFF"><big>+Year</big></td>
  88.  
  89.     <td align="left" id="CardNumber" onclick="tableclick('cardnumber')"
  90.  
  91.         bgcolor="#00FFFF"><big>+Number</big></td>
  92.  
  93.     <td align="left" id="setname" onclick="tableclick('setname')"
  94.  
  95.         bgcolor="#00FFFF"><big>Set Name</big></td>
  96.  
  97.     <td align="left" id="issuer" onclick="tableclick('issuer')"
  98.  
  99.         bgcolor="#00FFFF"><big>Issuer</big></td>
  100.  
  101.     <td align="left" id="description" onclick="tableclick('description')"
  102.  
  103.         bgcolor="#00FFFF"><big>Description</big></td>
  104.  
  105.     <td align="left" id="grade" onclick="tableclick('grade')"
  106.  
  107.         bgcolor="#00FFFF"><big>Grade</big></td>
  108.  
  109.     <td align="right" id="value" onclick="tableclick('value')"
  110.  
  111.         bgcolor="#00FFFF"><big>Value</big></td>
  112.  
  113.   </tr>
  114.  
  115. </THEAD>
  116.  
  117.   <tr>
  118.  
  119.     <td><div datafld="year"></div></td>
  120.  
  121.     <td><div datafld="cardnumber"></div></td>
  122.  
  123.     <td><div datafld="setname"></div></td>
  124.  
  125.     <td><div datafld="issuer"></div></td>
  126.  
  127.     <td><div datafld="description"></div></td>
  128.  
  129.     <td><div datafld="grade"></div></td>
  130.  
  131.     <td width="50" align="right"><div datafld="value"></div></td>
  132.  
  133.   </tr>
  134.  
  135. <TFOOT>
  136.  
  137.   <tr>
  138.  
  139.     <td colspan="6" align="right" height="40" bgcolor="#000080">
  140.  
  141.     <font color="#FF0000" size="4"><strong>Total:</strong></font></td>
  142.  
  143.     <td valign="center" align="right" bgcolor="#000080">
  144.  
  145.     <font color="#FF0000" size="4">
  146.  
  147.     <strong><div id="TotalText"></div></strong></font></td>
  148.  
  149.   </tr>
  150.  
  151. </TFOOT>
  152.  
  153. </table>
  154.  
  155.  
  156.  
  157. <!-- START modified from Listing 18.4 -->
  158.  
  159. <hr>
  160.  
  161. <p id="pagesizetext" align="center">Page Size: 5</p>
  162.  
  163. <p align="center"><strong><input type="button" value="Previous Page" name="B1"
  164.  
  165. onclick="scrollpage(0)"> <input type="button" value="Next Page" name="B1"
  166.  
  167. onclick="scrollpage(1)"> </strong></p>
  168.  
  169.  
  170.  
  171. <p align="center"><input type="button" value="Decrease Page Size" name="B1"
  172.  
  173. onclick="pagesize(0)"><strong>
  174.  
  175. <input type="button" value="Increase Page Size" name="B1"
  176.  
  177. onclick="pagesize(1)"></strong></p>
  178.  
  179.  
  180.  
  181. <p align="center"><input type="button" value="Disable Table Paging" name="B1"
  182.  
  183. onclick="pagesize(2)"></p>
  184.  
  185. <!-- END modified from Listing 18.4 -->
  186.  
  187.  
  188.  
  189. <script language="VBScript"><!--
  190.  
  191. sub tableclick(columnname)
  192.  
  193.  
  194.  
  195. if columnname <> "year" and
  196.  
  197. cc]   (left(document.all.item("year").innertext,1) = "+"
  198.  
  199. cc]   or left(document.all.item("year").innertext,1) = "-") then
  200.  
  201.       document.all.item("year").innerHTML = "<big>" +
  202.  
  203. cc]         mid(document.all.item("year").innertext,2) + "</big>"
  204.  
  205. end if
  206.  
  207.  
  208.  
  209. if columnname <> "cardnumber" and
  210.  
  211. cc]   (left(document.all.item("cardnumber").innertext,1) = "+" or
  212.  
  213. cc]   left(document.all.item("cardnumber").innertext,1) = "-") then
  214.  
  215.       document.all.item("cardnumber").innerHTML = "<big>" +
  216.  
  217. cc]          mid(document.all.item("cardnumber").innertext,2) + "</big>"
  218.  
  219. end if
  220.  
  221.  
  222.  
  223. if columnname <> "setname" and
  224.  
  225. cc]  (left(document.all.item("setname").innertext,1) = "+" or
  226.  
  227. cc]  left(document.all.item("setname").innertext,1) = "-") then
  228.  
  229.     document.all.item("setname").innerHTML = "<big>" +
  230.  
  231. cc]        mid(document.all.item("setname").innertext,2) + "</big>"
  232.  
  233. end if
  234.  
  235.  
  236.  
  237. if columnname <> "issuer" and
  238.  
  239. cc]  (left(document.all.item("issuer").innertext,1) = "+" or
  240.  
  241. cc]   left(document.all.item("issuer").innertext,1) = "-") then
  242.  
  243.      document.all.item("issuer").innerHTML = "<big>" +
  244.  
  245. cc]       mid(document.all.item("issuer").innertext,2) + "</big>"
  246.  
  247. end if
  248.  
  249.  
  250.  
  251. if columnname <> "description" and
  252.  
  253. cc]  (left(document.all.item("description").innertext,1) = "+" or
  254.  
  255. cc]   left(document.all.item("description").innertext,1) = "-") then
  256.  
  257.      document.all.item("description").innerHTML = "<big>" +
  258.  
  259. cc]       mid(document.all.item("description").innertext,2) + "</big>"
  260.  
  261. end if
  262.  
  263.  
  264.  
  265. if columnname <> "grade" and
  266.  
  267. cc]  (left(document.all.item("grade").innertext,1) = "+" or
  268.  
  269. cc]   left(document.all.item("grade").innertext,1) = "-") then
  270.  
  271.      document.all.item("grade").innerHTML = "<big>" +
  272.  
  273. cc]       mid(document.all.item("grade").innertext,2) + "</big>"
  274.  
  275. end if
  276.  
  277.  
  278.  
  279. if columnname <> "value" and
  280.  
  281. cc]  (left(document.all.item("value").innertext,1) = "+" or
  282.  
  283. cc]   left(document.all.item("value").innertext,1) = "-") then
  284.  
  285.      document.all.item("value").innerHTML = "<big>" +
  286.  
  287. cc]       mid(document.all.item("value").innertext,2) + "</big>"
  288.  
  289. end if
  290.  
  291.  
  292.  
  293. if left(document.all.item(columnname).innertext,1) = "+" then
  294.  
  295.    document.all.item(columnname).innerHTML =  "<big>-" +
  296.  
  297. cc]     mid(document.all.item(columnname).innertext,2) + "</big>"
  298.  
  299.    cards.sort = "-" + columnname
  300.  
  301. elseif left(document.all.item(columnname).innertext,1) = "-" then
  302.  
  303.    document.all.item(columnname).innerHTML = "<big>+" +
  304.  
  305. cc]     mid(document.all.item(columnname).innertext,2) + "</big>"
  306.  
  307.    cards.sort = columnname
  308.  
  309. else
  310.  
  311.    document.all.item(columnname).innerHTML = "<big>+" +
  312.  
  313. cc]     document.all.item(columnname).innertext + "</big>"
  314.  
  315.    cards.sort = columnname
  316.  
  317. end if
  318.  
  319.  
  320.  
  321. cards.reset
  322.  
  323.  
  324.  
  325. end sub
  326.  
  327.  
  328.  
  329. sub buttonclick(button)
  330.  
  331.  
  332.  
  333. if (left(document.all.item("year").innertext,1) = "+" or
  334.  
  335. cc]  left(document.all.item("year").innertext,1) = "-") then
  336.  
  337.     document.all.item("year").innerHTML = "<big>" +
  338.  
  339. cc]       mid(document.all.item("year").innertext,2) + "</big>"
  340.  
  341. end if
  342.  
  343.  
  344.  
  345. if (left(document.all.item("cardnumber").innertext,1) = "+" or
  346.  
  347. cc]  left(document.all.item("cardnumber").innertext,1) = "-") then
  348.  
  349.     document.all.item("cardnumber").innerHTML = "<big>" +
  350.  
  351. cc]       mid(document.all.item("cardnumber").innertext,2) + "</big>"
  352.  
  353. end if
  354.  
  355.  
  356.  
  357. if (left(document.all.item("setname").innertext,1) = "+" or
  358.  
  359. cc]  left(document.all.item("setname").innertext,1) = "-") then
  360.  
  361.     document.all.item("setname").innerHTML = "<big>" +
  362.  
  363. cc]       mid(document.all.item("setname").innertext,2) + "</big>"
  364.  
  365. end if
  366.  
  367.  
  368.  
  369. if (left(document.all.item("issuer").innertext,1) = "+" or
  370.  
  371. cc]  left(document.all.item("issuer").innertext,1) = "-") then
  372.  
  373.     document.all.item("issuer").innerHTML = "<big>" +
  374.  
  375. cc]       mid(document.all.item("issuer").innertext,2) + "</big>"
  376.  
  377. end if
  378.  
  379.  
  380.  
  381. if (left(document.all.item("description").innertext,1) = "+" or
  382.  
  383. cc]  left(document.all.item("description").innertext,1) = "-") then
  384.  
  385.     document.all.item("description").innerHTML = "<big>" +
  386.  
  387. cc]       mid(document.all.item("description").innertext,2) + "</big>"
  388.  
  389. end if
  390.  
  391.  
  392.  
  393. if (left(document.all.item("grade").innertext,1) = "+" or
  394.  
  395. cc]  left(document.all.item("grade").innertext,1) = "-") then
  396.  
  397.     document.all.item("grade").innerHTML = "<big>" +
  398.  
  399. cc]       mid(document.all.item("grade").innertext,2) + "</big>"
  400.  
  401. end if
  402.  
  403.  
  404.  
  405. if (left(document.all.item("value").innertext,1) = "+" or
  406.  
  407. cc]  left(document.all.item("value").innertext,1) = "-") then
  408.  
  409.     document.all.item("value").innerHTML = "<big>" +
  410.  
  411. cc]       mid(document.all.item("value").innertext,2) + "</big>"
  412.  
  413. end if
  414.  
  415.  
  416.  
  417. select case button
  418.  
  419. case 1
  420.  
  421.    document.all.item("year").innerHTML = "<big>+" +
  422.  
  423. cc]             document.all.item("year").innertext + "</big>"
  424.  
  425.    document.all.item("cardnumber").innerHTML = "<big>+" +
  426.  
  427. cc]             document.all.item("cardnumber").innertext + "</big>"
  428.  
  429.    cards.sort = "year; cardnumber"
  430.  
  431. case 2
  432.  
  433.    document.all.item("description").innerHTML = "<big>+" +
  434.  
  435. cc]             document.all.item("description").innertext + "</big>"
  436.  
  437.     cards.sort = "description"
  438.  
  439. case 3
  440.  
  441.    document.all.item("year").innerHTML = "<big>+" +
  442.  
  443. cc]             document.all.item("year").innertext + "</big>"
  444.  
  445.    document.all.item("grade").innerHTML = "<big>+" +
  446.  
  447. cc]             document.all.item("grade").innertext + "</big>"
  448.  
  449.    cards.sort = "year; grade"
  450.  
  451. case 4
  452.  
  453.    document.all.item("value").innerHTML = "<big>+" +
  454.  
  455. cc]             document.all.item("value").innertext + "</big>"
  456.  
  457.    cards.sort = "value"
  458.  
  459. end select
  460.  
  461.  
  462.  
  463. cards.reset
  464.  
  465. end sub
  466.  
  467.  
  468.  
  469. sub filteryear(reset)
  470.  
  471.  
  472.  
  473. if reset then
  474.  
  475.    fstring = ""
  476.  
  477. else
  478.  
  479.    fstring = "year = " + document.forms("filterform").item("filteryear").value
  480.  
  481. end if
  482.  
  483.  
  484.  
  485. cards.filter = fstring
  486.  
  487. cards.reset
  488.  
  489.  
  490.  
  491. end sub
  492.  
  493.  
  494.  
  495. <!-- START modified from Listing 18.4 -->
  496.  
  497. sub scrollpage(direction)
  498.  
  499.  
  500.  
  501. if direction = 0 then
  502.  
  503.    mytable.previouspage
  504.  
  505. else
  506.  
  507.    mytable.nextpage
  508.  
  509. end if
  510.  
  511.  
  512.  
  513. end sub
  514.  
  515.  
  516.  
  517. sub pagesize(direction)
  518.  
  519.  
  520.  
  521. if direction = 0 and mytable.datapagesize > 1 then
  522.  
  523.    mytable.datapagesize = mytable.datapagesize - 1
  524.  
  525.    document.all.pagesizetext.innertext = "Page Size: "
  526.  
  527. cc]        + cstr(mytable.datapagesize)
  528.  
  529. elseif direction = 1 then
  530.  
  531.    mytable.datapagesize = mytable.datapagesize + 1
  532.  
  533.    document.all.pagesizetext.innertext = "Page Size: "
  534.  
  535. cc]        + cstr(mytable.datapagesize)
  536.  
  537. elseif direction = 2 then
  538.  
  539.    mytable.datapagesize = 0
  540.  
  541.    document.all.pagesizetext.innertext = "Table paging disabled"
  542.  
  543. end if
  544.  
  545.  
  546.  
  547. end sub
  548.  
  549. <!-- END modified from Listing 18.4 -->
  550.  
  551.  
  552.  
  553. sub dataloaded()
  554.  
  555.  
  556.  
  557. while not(cards.recordset.eof)
  558.  
  559.    total = total + cards.recordset("value")
  560.  
  561.    cards.recordset.movenext
  562.  
  563. wend
  564.  
  565. document.all.totaltext.innertext = total
  566.  
  567.  
  568.  
  569. end sub
  570.  
  571. --></script>
  572.  
  573. </body></html>
  574.  
  575.